// ============ 全局变量 ============
const url = "/api/rest/dept"; // 部门接口基础URL
let addForm = document.getElementById('add-form');
let gridInstance = null;
let deptData = null; // 存储部门列表数据
let editForm = document.getElementById('edit-form');
const searchForm = document.getElementById('search-form');

// ============ 表格列配置（按要求定义列） ============
const columns = [
  { name: 'ID', id: 'id', width: '8%' },
  { name: '部门名称', id: 'name', sort: true },
  { name: '描述', id: 'description', sort: true },
  { name: '状态', id: 'enableState', sort: true },
  { name: '创建时间', id: 'createAt', sort: true },
  {
    name: '操作',
    id: 'actions',
    width: '20%',
    formatter: (_, row) => gridjs.html(`
      <button type="button" data-bs-toggle="modal" data-bs-target="#editModal" class="btn btn-sm btn-outline-primary m-1">
        <i class="fas fa-edit"></i> 编辑
      </button>
      <button type="button" onclick="toggle('${row.cells[0].data}')" class="btn btn-sm btn-outline-${row.cells[3].data === '启用' ? 'warning' : 'success'} m-1">
        <i class="fas fa-exchange"></i> ${row.cells[3].data === '启用' ? '停用' : '启用'}
      </button>
    `)
  }
];

// ============ 表格配置项 ============
const gridOptions = {
  columns: columns,
  server: {
    url: url, // 部门接口URL
    then: data => {
      deptData = data.content; // 存储部门数据
      // 格式化表格数据（对应columns顺序）
      return data.content.map(dept => [
        dept.id,
        dept.name,
        dept.description || '', // 描述可能为空，默认空字符串
        dept.enableState,
        dept.createAt
      ]);
    },
    total: data => data.totalElements // 总条数（用于分页）
  },
  pagination: {
    limit: 10, // 部门不分页太多，设为10条/页
    server: {
      url: (prev, page, limit) => addQueryParam(prev, `size=${limit}&page=${page}`)
    }
  },
  search: false, // 关闭gridjs自带搜索，使用自定义搜索栏
  sort: true, // 启用列排序
  language: {
    pagination: {
      previous: '上一页',
      next: '下一页',
      showing: '显示第',
      of: '条，共',
      to: '至',
      results: '条记录'
    }
  }
};

// ============ 登录状态校验（复用user.js逻辑） ============
if (localStorage.getItem('user') !== 'true') {
  alert('请先登录系统！');
  window.location.href = 'login.html';
  throw new Error('未登录，已跳转');
}

// ============ 工具函数：URL参数拼接（复用） ============
function addQueryParam(url, param) {
  const separator = url.indexOf('?') !== -1 ? '&' : '?';
  return url + separator + param;
}

// ============ 表格初始化函数 ============
function initGrid() {
  if (gridInstance) {
    gridInstance.destroy(); // 销毁旧实例
  }
  // 渲染新表格
  gridInstance = new gridjs.Grid(gridOptions).render(document.getElementById("gridjs-container"));
}

// ============ 搜索表单提交事件 ============
searchForm.addEventListener('submit', (event) => {
  event.preventDefault(); // 阻止默认提交
  const formData = new FormData(searchForm);
  const searchParams = new URLSearchParams(formData);
  const params = searchParams.toString();
  // 拼接搜索参数，避免重复叠加
  gridOptions.server.url = addQueryParam(url, params);
  gridInstance.updateConfig(gridOptions).forceRender(); // 刷新表格
});

// ============ 页面加载完成后初始化 ============
document.addEventListener('DOMContentLoaded', function () {
  initGrid(); // 初始化表格
  initParentDept(); // 初始化上级部门下拉框

  // 编辑按钮点击事件：填充编辑表单
  gridInstance.on('cellClick', (...args) => {
    const event = args[0];
    const deptId = args[3].cells[0].data; // 获取部门ID
    const dept = deptData.find(item => item.id === deptId); // 查找对应部门数据

    if (event.target && dept) { // 容错处理
      editForm.elements['id'].value = deptId;
      editForm.querySelector('[name="name"]').value = dept.name || '';
      editForm.querySelector('[name="code"]').value = dept.code || '';
      // 上级部门赋值（如果是顶级部门，默认空值）
      editForm.querySelector('[name="parentId"]').value = dept.parent?.id || '';
      editForm.querySelector('[name="description"]').value = dept.description || '';
    }
  });
});

// ============ 初始化上级部门下拉框（新增/编辑表单） ============
function initParentDept() {
  fetch('/api/rest/dept/all') // 获取所有部门作为上级选项
    .then(response => response.json())
    .then(data => {
      const addSelect = addForm.querySelector('[name="parentId"]');
      const editSelect = editForm.querySelector('[name="parentId"]');

      // 清空现有选项（保留默认“无”选项）
      while (addSelect.options.length > 1) {
        addSelect.remove(1);
        editSelect.remove(1);
      }

      // 动态添加上级部门选项
      data.forEach(dept => {
        const option = document.createElement('option');
        option.value = dept.id;
        option.innerText = dept.name; // 显示部门名称

        // 为两个表单创建独立选项
        addSelect.appendChild(option.cloneNode(true));
        editSelect.appendChild(option.cloneNode(true));
      });
    })
    .catch(error => console.error('上级部门初始化失败:', error));
}

// ============ 工具函数：表单数据转JSON（复用） ============
function formJsonData(form) {
  const jsonData = {};
  const formData = new FormData(form);
  formData.forEach((value, key) => {
    if (!jsonData[key]) {
      jsonData[key] = formData.getAll(key).length > 1 ? formData.getAll(key) : formData.get(key);
    }
  });
  return jsonData;
}

// ============ 新增部门表单提交 ============
addForm.addEventListener('submit', (event) => {
  event.preventDefault();
  if (addForm.checkValidity()) { // 表单校验
    const jsonData = formJsonData(addForm);
    fetch(url, {
      method: 'POST',
      headers: { 'Content-Type': 'application/json' },
      body: JSON.stringify(jsonData)
    }).then(response => {
      if (response.ok) {
        // 关闭模态框
        bootstrap.Modal.getInstance(document.getElementById('addModal')).hide();
        initGrid(); // 刷新表格
        // 成功提示
        Toastify({
          text: "成功添加新部门",
          duration: 3000,
          close: true,
          backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
          style: { borderRadius: "10px" }
        }).showToast();
        addForm.reset(); // 重置表单
        addForm.classList.remove('was-validated'); // 清除验证样式
      } else {
        response.json().then(data => alert(data.message || '添加部门失败'));
      }
    }).catch(error => {
      console.error('添加部门错误:', error);
      alert('网络错误，添加失败');
    });
  } else {
    addForm.classList.add('was-validated'); // 显示验证错误
  }
});

// ============ 编辑部门表单提交 ============
editForm.addEventListener('submit', (event) => {
  event.preventDefault();
  if (editForm.checkValidity()) { // 表单校验
    const jsonData = formJsonData(editForm);
    fetch(`${url}/${jsonData.id}`, {
      method: 'PATCH',
      headers: { 'Content-Type': 'application/json' },
      body: JSON.stringify(jsonData)
    }).then(response => {
      if (response.ok) {
        // 关闭模态框
        bootstrap.Modal.getInstance(document.getElementById('editModal')).hide();
        initGrid(); // 刷新表格
        // 成功提示
        Toastify({
          text: "编辑部门成功",
          duration: 3000,
          close: true,
          backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
          style: { borderRadius: "10px" }
        }).showToast();
        editForm.classList.remove('was-validated'); // 清除验证样式
      } else {
        response.json().then(data => alert(data.message || '编辑部门失败'));
      }
    }).catch(error => {
      console.error('编辑部门错误:', error);
      alert('网络错误，编辑失败');
    });
  } else {
    editForm.classList.add('was-validated'); // 显示验证错误
  }
});

// ============ 部门启用/停用状态切换 ============
function toggle(id) {
  fetch(`${url}/${id}/toggle`, { method: 'PATCH' })
    .then(response => {
      if (response.ok) {
        gridInstance.forceRender(); // 刷新表格
        Toastify({
          text: "部门状态切换成功",
          duration: 2000,
          close: true,
          backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
          style: { borderRadius: "10px" }
        }).showToast();
      }
    })
    .catch(error => {
      console.error('状态切换错误:', error);
      alert('部门状态切换失败');
    });
}

// ============ 登出函数（复用user.js逻辑） ============
function logout() {
  fetch('/api/rest/user/logout', { method: 'GET' })
    .then(response => {
      if (response.ok) {
        localStorage.removeItem('user');
        window.location.href = 'login.html';
      } else {
        console.error('登出失败');
        alert('登出失败，请重试');
      }
    })
    .catch(error => {
      console.error('登出网络错误:', error);
      alert('网络错误，登出失败');
    });
}